<template>
    <TestPage
    :table-data="tableData"
    :columns="tableColumns"
    :current-page="pageNo"
    :total="allPage"
    :page-size="pageSize"
    @page-change="handlePageChange"
    @action="handleTableAction"
    ></TestPage>



</template>

<script lang="ts" setup>
import { ref } from 'vue';
import TestPage from './TestPage.vue';
import type { Customer } from '@/types/public-xs/Customer';
import axios from 'axios';

let pageNo=ref(1)
let pageSize=ref(3)
let allPage=ref(0)
const tableColumns = ref([
  { prop: 'id', label: '序号' },
  { prop: 'code', label: '客户编码' },
  { prop: 'name', label: '客户名称' },
  { prop: 'area', label: '客户业务地区' },
  { prop: 'address', label: '客户地址' },
  { prop: 'phoneNum', label: '手机号' },
  { prop: 'money', label: '交易' },
  { prop: 'isDelete', label: '交易' },
])
let tableData=ref<Customer[]>([])
    const handlePageChange = (newPage: number) => {
        pageNo.value = newPage
  
  fetchData(newPage)
}


const handleTableAction = (actionName: string) => {
  console.log('触发操作:', actionName)
  // 处理具体业务逻辑
}
async function fetchData(page: number) {
    let response=await axios.post('http://localhost:8081/Customer/selectCustomerByPage',{
        pageNo:pageNo.value,
        pageSize:pageSize.value
    })
    tableData.value=response.data.data.list
    allPage.value=response.data.data.total
   
}
fetchData(1)
</script>

<style>


</style>